import React, { Component } from 'react'
import axios from "axios"
import RelationCard from './RelationCard';

export default class FiveContent extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: []
        }

        axios.get('/static/relation.json').then(res => {
            let data = [];

            res.data.map((item, index) => {
                data.push(item);
                return index;
            });

            this.setState({
                data
            })
        })
    }

    render() {
        return (
            <div>
                <div style={{
                    paddingTop: 30,
                    textAlign: 'center',
                    fontSize: 30,
                    paddingBottom: 80,
                    fontWeight: 700
                }}>
                    <span style={{
                        textDecoration: 'line-through',
                        color: '#bbb',
                        fontSize: 20
                    }}>有机会</span>
                    <span style={{
                        color: '#f00'
                    }}>一定要</span>
                    <span>联系我们!</span>
                </div>
                <div style={{
                    width: 1200,
                    margin: '0 auto',
                    display: 'flex',
                    justifyContent: 'space-between'
                }}>
                    {
                        this.state.data.map((item, index) => {
                            return <RelationCard key={index} data={item}/>
                        })
                    }
                </div>
            </div>
        )
    }
}
